<!-- [BE-BIP] Background Item Panel -->
<div id="bg_setting_panel" class="bg_setting_panel">
    <!-- [IP-1] Layer1 - Recurrence patterns -->
    <div id="panel_bg_pattern" class="panel_bg_pattern">
        <!-- Mini gallery box 1 -->
        <div id="box_outer_rp1" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">Preset Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_rp1" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_rp1" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_rp1.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 1 -->

        <div class="gab-h5"></div> <!-- Gab -->

        <!-- Mini gallery box 2 -->
        <div id="box_outer_rp2" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">User's Uploaded Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_rp2" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_rp2" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_rp2.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 2 -->

        <!-- Background area selector -->
        <div class="select_bg_box">
            <div class="gab-h10"></div> <!-- Gab -->
            <div class="iblock font-i14blk select_bg_title">Area<br />Selector</div>
            <div class="gab-v10"></div> <!-- Gab -->
            <div class="border-rc bshadow-01304 iblock rp_select_bg">
                <input class="input_rb3" type="radio" checked="checked" name="rp_select1" value="rp_select1" id="rp_select1" title="Outer Background Select" />
            </div>
            <div class="gab-v3"></div> <!-- Gab -->
            <div class="iblock">
                <img class="select_bg_img" src="../assets/book/editor/images/icon_bs_body.png" />
            </div>
            <div class="gab-v10"></div> <!-- Gab -->
            <div class="border-rc bshadow-01304 iblock rp_select_bg">
                <input class="input_rb3" type="radio" name="rp_select2" value="rp_select2" id="rp_select2" title="Inner Background Select" />
            </div>
            <div class="gab-v3"></div> <!-- Gab -->
            <div class="iblock">
                <img class="select_bg_img" src="../assets/book/editor/images/icon_bs_page.png" />
            </div>
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Background area selector -->
    </div>
    <!-- //[IP-1] Layer1 - Recurrence patterns -->

    <!-- [IP-2] Layer2 - Texture (Wallpaper) -->
    <div id="panel_bg_texture" class="panel_bg_texture">
        <!-- Mini gallery box 1 -->
        <div id="box_outer_tx1" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">Preset Pattern Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_tx1" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_tx1" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_tx1.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 1 -->

        <div class="gab-h5"></div> <!-- Gab -->

        <!-- Mini gallery box 2 -->
        <div id="box_outer_tx2" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">User's Uploaded Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_tx2" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_tx2" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_tx2.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 2 -->

        <!-- Background area selector -->
        <div class="select_bg_box">
            <div class="gab-h10"></div> <!-- Gab -->
            <div class="iblock font-i14blk select_bg_title">Area<br />Selector</div>
            <div class="gab-v10"></div> <!-- Gab -->
            <div class="border-rc bshadow-01304 iblock tx_select_bg">
                <input class="input_rb3" type="radio" name="tx_select1" value="tx_select1" id="tx_select1" title="Outer Background Select" />
            </div>
            <div class="gab-v3"></div> <!-- Gab -->
            <div class="iblock">
                <img class="select_bg_img" src="../assets/book/editor/images/icon_bs_body.png" />
            </div>
            <div class="gab-v10"></div> <!-- Gab -->
            <div class="border-rc bshadow-01304 iblock tx_select_bg">
                <input checked="checked" class="input_rb3" type="radio" name="tx_select2" value="tx_select2" id="tx_select2" title="Inner Background Select" />
            </div>
            <div class="gab-v3"></div> <!-- Gab -->
            <div class="iblock">
                <img class="select_bg_img" src="../assets/book/editor/images/icon_bs_page.png" />
            </div>
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Background area selector -->

        <div class="gab-v10"></div> <!-- Gab -->

        <!-- Transparency Controller -->
        <div class="box_outer">
            <div class="block-both box_top">
                <div class="flblock font-i16blk box_title">Transparency Controller</div>

                <div class="frblock amount">
                    <label class="font-n11dg" for="amount_texture">Opacity : </label>
                    <input type="text" id="amount_texture" class="amount_input">
                </div>
            </div>

            <div class="gab-h5"></div> <!-- Gab -->
            <div class="slider_box">
                <div id="slider_texture" class="border-r15 bshadow-01305i slider_bar"></div>
            </div>

            <div class="gab-v10"></div> <!-- Gab -->
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Transparency Controller -->
    </div>
    <!-- //[IP-2] Layer2 - Texture (Wallpaper) -->

    <!-- [IP-3] Layer3 - Main image -->
    <div id="panel_bg_pic" class="panel_bg_pic">
        <!-- Mini gallery box 1 -->
        <div id="box_outer_mi1" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">Preset Pattern Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_mi1" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_mi1" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_mi1.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 1 -->

        <div class="gab-h5"></div> <!-- Gab -->

        <!-- Mini gallery box 2 -->
        <div id="box_outer_mi2" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">User's Uploaded Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_mi2" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_mi2" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_mi2.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 2 -->

        <div class="gab-h5"></div> <!-- Gab -->

        <!-- Main image mask option -->
        <div class="box_outer">
            <div class="box_top">
                <div class="flblock font-i16blk box_title">Image mask options</div>
            </div>
            <div class="gab-h5"></div> <!-- Gab -->
            <div class="border-1s-ldws border-r5 bgpic_mask">
                <img class="opt_mask_lt" src="../assets/book/editor/images/opt_mask_lt.png" title="Masking to bottom, right" />
                <img class="opt_mask_rt" src="../assets/book/editor/images/opt_mask_rt.png" title="Masking to bottom, left" />
                <img class="opt_mask_lb" src="../assets/book/editor/images/opt_mask_lb.png" title="Masking to top, right" />
                <img class="opt_mask_rb" src="../assets/book/editor/images/opt_mask_rb.png" title="Masking to top, left" />
                <img class="opt_mask_cc bgpic_mask_on" src="../assets/book/editor/images/opt_mask_cc.png" title="Masking to outside" />
                <img class="opt_mask_ll" src="../assets/book/editor/images/opt_mask_ll.png" title="Masking to right" />
                <img class="opt_mask_rr" src="../assets/book/editor/images/opt_mask_rr.png" title="Masking to left" />
                <img class="opt_mask_tt" src="../assets/book/editor/images/opt_mask_tt.png" title="Masking to bottom" />
                <img class="opt_mask_bb" src="../assets/book/editor/images/opt_mask_bb.png" title="Masking to top" />
                <img class="opt_mask_00" src="../assets/book/editor/images/opt_mask_00.png" title="Mask clear" />
            </div>
        </div>
        <!-- //Main image mask option -->

        <div class="gab-h20"></div> <!-- Gab -->

        <!-- Transparency Controller -->
        <div class="box_outer">
            <div class="block-both box_top">
                <div class="flblock font-i16blk box_title">Transparency Controller</div>

                <div class="frblock amount">
                    <label class="font-n11dg" for="amount_pic">Opacity : </label>
                    <input type="text" id="amount_pic" class="amount_input">
                </div>
            </div>

            <div class="gab-h5"></div> <!-- Gab -->
            <div class="slider_box">
                <div id="slider_pic" class="border-r15 bshadow-01305i slider_bar"></div>
            </div>

            <div class="gab-v10"></div> <!-- Gab -->
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Transparency Controller -->
    </div>
    <!-- //[IP-3] Layer3 - Main image -->

    <!-- [IP-4] Layer4 - Color -->
    <div id="panel_bg_color" class="panel_bg_color">
        <div class="box_outer">
            <div class="block-both box_top">
                <div class="flblock font-i16blk box_title">Color Picker</div>
            </div>
            <div class="gab-h10"></div> <!-- Gab -->
            <input type='text' id="colorset1" value='' />

            <br /><br /><div class="font-n11dg">컬러피커는 아직 작업 중.<br />위에 있는 팝업형 컬러피커를 임시로 사용</div>
        </div>
    </div>
    <!-- //[IP-4] Layer4 - Color -->

    <!-- [IP-5] Layer5 - Envelop -->
    <div id="panel_bg_envelop" class="panel_bg_envelop">
        <!-- Mini gallery box 1 -->
        <div id="box_outer_en1" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">Preset Pattern Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_en1" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_en1" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_en1.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 1 -->

        <div class="gab-h5"></div> <!-- Gab -->

        <!-- Mini gallery box 2 -->
        <div id="box_outer_en2" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">User's Uploaded Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_en2" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_en2" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_en2.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 2 -->

        <div class="gab-v10"></div> <!-- Gab -->

        <!-- Transparency Controller -->
        <div class="box_outer">
            <div class="block-both box_top">
                <div class="flblock font-i16blk box_title">Transparency Controller</div>

                <div class="frblock amount">
                    <label class="font-n11dg" for="amount_envelop">Opacity : </label>
                    <input type="text" id="amount_envelop" class="amount_input">
                </div>
            </div>

            <div class="gab-h5"></div> <!-- Gab -->
            <div class="slider_box">
                <div id="slider_envelop" class="border-r15 bshadow-01305i slider_bar"></div>
            </div>

            <div class="gab-v10"></div> <!-- Gab -->
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Transparency Controller -->
    </div>
    <!-- //[IP-5] Layer5 - Envelop -->

    <!-- [IP-6] Layer6 - Effect -->
    <div id="panel_bg_effect" class="panel_bg_effect">
        <!-- Mini gallery box 1 -->
        <div id="box_outer_se1" class="box_outer">
            <!-- box top area (Title) -->
            <div class="font-i16blk box_top">
                <div class="box_title">Preset Pattern Images</div>
            </div>
            <!-- //box top area (Title) -->
            <div class="gab-h5"></div> <!-- Gab -->
            <!-- Thumbnail area -->
            <div id="photo_box_se1" class="border-r5 bshadow-01305 photo_box">
                <div id="photo_box_inner_se1" class="photo_box_inner lazy">
                    <?php include_once '../sample_gallery/sample_galh_se1.php'; ?>
                </div>
            </div>
            <!-- //Thumbnail area -->
        </div>
        <!-- //Mini gallery box 1 -->

        <div class="gab-v10"></div> <!-- Gab -->

        <!-- Transparency Controller -->
        <div class="box_outer">
            <div class="block-both box_top">
                <div class="flblock font-i16blk box_title">Transparency Controller</div>

                <div class="frblock amount">
                    <label class="font-n11dg" for="amount_effect">Opacity : </label>
                    <input type="text" id="amount_effect" class="amount_input">
                </div>
            </div>

            <div class="gab-h5"></div> <!-- Gab -->
            <div class="slider_box">
                <div id="slider_effect" class="border-r15 bshadow-01305i slider_bar"></div>
            </div>

            <div class="gab-v10"></div> <!-- Gab -->
            <div class="line-a1"></div> <!-- Deco line -->
        </div>
        <!-- //Transparency Controller -->
    </div>
    <!-- //[IP-6] Layer6 - Effect -->
</div>
<!-- //[BE-BIP] Background Item Panel -->

